<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <link type="text/css" rel="stylesheet" href="../style/avalon.doc.css"/>
        <script src="../avalon.js"></script>
        <script type="text/javascript">
            require(["dropdown/avalon.dropdown.js", "ready!"], function() {
                //multiple select vmodel
                avalon.define('mulSelect', function(vm) {
                    vm.s1 = ['value1', '1', null, false];
                });
                avalon.scan();
            });
        </script>
        <script src="../highlight/shCore.js"></script>
    </head>
    <body>
        <div class="wrapper">
            <div ms-controller="mulSelect">
                <h2>multiple select（多选下拉框）</h2>
                <p>使用html配置dropdown并附加双工绑定，默认处理value的值为Number，Boolean，null的情况</p>
                <select ms-duplex="s1"
                        ms-widget="dropdown"
                        multiple>
                    <optgroup label="group1">
                        <option value="value1">Value 1</option>
                        <option>textValue</option>
                        <option label="label" value="labelValue">with label</option>
                        <option value="null">Value 2</option>
                        <option value="1">Value 3</option>
                    </optgroup>
                    <optgroup label="group2">
                        <option value="false">Value 4</option>
                        <option value="value5" disabled>Value 5</option>
                        <option value="value6">Value 6</option>
                    </optgroup>
                </select>
                <p>select1: {{s1}}</p>
            </div>
            <pre class="brush:html;gutter:false;toolbar:false;" ms-skip>
&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;title&gt;&lt;/title&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width"&gt;
    &lt;script src="../avalon.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;
            require(["dropdown/avalon.dropdown.js", "ready!"], function() {
                //multiple select vmodel
                avalon.define('mulSelect', function(vm) {
                    vm.s1 = ['value1', 1, null, false];
                });
                avalon.scan();
            });
    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div class="wrapper"&gt;
        &lt;div ms-controller="mulSelect"&gt;
            &lt;h2&gt;multiple select（多选下拉框）&lt;/h2&gt;
            &lt;p&gt;使用html配置dropdown并附加双工绑定，默认处理value的值为Number，Boolean，null的情况&lt;/p&gt;
            &lt;select ms-duplex="s1"
                    ms-widget="dropdown"
                    multiple&gt;
                &lt;optgroup label="group1"&gt;
                    &lt;option value="value1"&gt;Value 1&lt;/option&gt;
                    &lt;option&gt;textValue&lt;/option&gt;
                    &lt;option label="label" value="labelValue"&gt;with label&lt;/option&gt;
                    &lt;option value="null"&gt;Value 2&lt;/option&gt;
                    &lt;option value="1"&gt;Value 3&lt;/option&gt;
                &lt;/optgroup&gt;
                &lt;optgroup label="group2"&gt;
                    &lt;option value="false"&gt;Value 4&lt;/option&gt;
                    &lt;option value="value5" disabled&gt;Value 5&lt;/option&gt;
                    &lt;option value="value6"&gt;Value 6&lt;/option&gt;
                &lt;/optgroup&gt;
            &lt;/select&gt;
            &lt;p&gt;select1: &#123;&#123;s1&#125;&#125;&lt;/p&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
            </pre>
        </div>
    </body>
</html>
